<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>ECharts</title>
    <!-- 引入 echarts.js -->
    <script src="js/echarts.min.js"></script>
    <script src="js/jquery.min.js"></script>
    <style type="text/css">
    	#main1{
    	align-content: left;
    	
    	}
    	#main2{
    	align-content: right;
    	}
    
    </style>
</head>
<body>
    <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main1" style="width: 600px;height:400px;"></div>
    <script type="text/javascript">
    
    	setInterval(a(),1000);
    
    	function a(){
    
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main1'));
        
        var option = {
        	    title : {
        	        text: '某学习网站实战课程访问量的实时统计',
        	        x:'center'
        	    },
        	    tooltip : {
        	        trigger: 'item',
        	        formatter: "{a} <br/>{b} : {c} ({d}%)"
        	    },
        	    legend: {
        	        orient: 'vertical',
        	        left: 'left',
        	       data: []
        	    },
        	    series : [
        	        {
        	            name: '课程访问量统计',
        	            type: 'pie',
        	            radius : '55%',
        	            center: ['50%', '60%'],
        	            data:(function a(){  //<![CDATA[
        	            	var city=[];
        	            	$.ajax({
        	            		type:"POST",
        	            		url:"../get_coursecount",
        	            		dataType:'json',
        	            		async:false,		//
        	            		success:function(result){
        	            			for(var i=0;i<result.length;i++){
        	            				//alert("调用了");
        	            				city.push({"value":result[i].value,"name":result[i].name});
        	            			}
        	            			
        	            		}
        	            	})
        	            	return city;
        	            })(),//]]>
        	            itemStyle: {
        	                emphasis: {
        	                    shadowBlur: 10,
        	                    shadowOffsetX: 0,
        	                    shadowColor: 'rgba(0, 0, 0, 0.5)'
        	                }
        	            }
        	        }
        	    ]
        	};
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    	}
      </script> 
</body>
</html>